<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>Document</title>
	<style type="text/css">
		span{
			padding: 4px;
			background-color: #ccc;
			border-radius: 4px;
		}
	</style>
	<script type="text/javascript" src="../util/chajian/jquery.min.js"></script>
</head>
<body>
	<h1>
		倒计时：
		距离2017年12月11日上午8点还有：<span>10</span>天<span>--</span>时<span>--</span>分<span>--</span>秒
	</h1>
	<script type="text/javascript">
		var spans = document.getElementsByTagName("span");
		// 每秒都发出Ajax请求，请求服务器时间！
		setInterval(function(){
			 
			var xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function(){
				if(xhr.readyState == 2){
					//先得到下行响应的报头的时间，然后提炼出标准能够用new Date()的字符串。
					var serverDate = xhr.getResponseHeader("Date").substr(5,20);
					//我们的目标日期时间
					var t1 = new Date("07 Dec 2017 08:00:00");
					//把服务器的格林威治时间，变为北京时间
					var t2 = new Date(Date.parse(new Date(serverDate)) + 8 * 60 * 60 * 1000);
				 
					//毫秒数
					var msdiff = t1 - t2;
 
					var D = parseInt(msdiff / 1000 / 60 / 60 / 24);
					var H = parseInt(msdiff % (1000 * 60 * 60 * 24) / 1000 / 60 / 60);
					var M = parseInt(msdiff % (1000 * 60 * 60) / 1000 / 60);
					var S = parseInt(msdiff % (1000 * 60) / 1000);

					//在页面中显示
					var arr = [D,H,M,S];
							console.log(arr)
					for(var i = 0 ; i < 4 ; i++){
						spans[i].innerHTML = arr[i];
					}
				}
			}
			xhr.open("get","temp.txt" + Math.random(),true);
			xhr.send(null);
		},10);
			
	</script>
</body>
</html>